/**
 * Created by wuyunan on 2017/5/19.
 */
import React from "react";

import PropTypes from "prop-types";
import {
  StyleSheet, Text, View, SafeAreaView,
} from "react-native";
import { Color, FontSize, isIOS } from "../../common/index";

const HeaderTitle = props => {
  const {
    paddingVertical, color, fontSize, text,
  } = props;
  return (
    <SafeAreaView style={{ flexDirection: "row", alignSelf: "center" }}>
      <View style={{ paddingHorizontal: 11, paddingVertical, backgroundColor: Color.red }}>
        <Text
          style={[
            styles.text,
            {
              color,
              fontSize,
            },
          ]}
        >
          {text}
        </Text>
      </View>
    </SafeAreaView>
  );
};
HeaderTitle.defaultProps = {
  color: Color.white,
  fontSize: FontSize.SIZE_18,
  paddingVertical: isIOS ? 10 : 21,
};
HeaderTitle.propsTypes = {
  text: PropTypes.string,
  color: Text.propTypes.color,
  fontSize: Text.propTypes.fontSize,
  paddingVertical: PropTypes.number,
};
const styles = StyleSheet.create({
  text: {
    fontSize: FontSize.SIZE_18,
    color: Color.white,
  },
});
export default HeaderTitle;
